.el-mention {
    position: relative;
    width: 100%
}

.el-mention__popper.el-popper {
    background: var(--el-bg-color-overlay);
    border: 1px solid var(--el-border-color-light);
    box-shadow: var(--el-box-shadow-light)
}

.el-mention__popper.el-popper .el-popper__arrow:before {
    border: 1px solid var(--el-border-color-light)
}

.el-mention__popper.el-popper[data-popper-placement^=top] .el-popper__arrow:before {
    border-left-color: transparent;
    border-top-color: transparent
}

.el-mention__popper.el-popper[data-popper-placement^=bottom] .el-popper__arrow:before {
    border-bottom-color: transparent;
    border-right-color: transparent
}

.el-mention__popper.el-popper[data-popper-placement^=left] .el-popper__arrow:before {
    border-bottom-color: transparent;
    border-left-color: transparent
}

.el-mention__popper.el-popper[data-popper-placement^=right] .el-popper__arrow:before {
    border-right-color: transparent;
    border-top-color: transparent
}

.el-mention-dropdown {
    --el-mention-font-size: var(--el-font-size-base);
    --el-mention-bg-color: var(--el-bg-color-overlay);
    --el-mention-shadow: var(--el-box-shadow-light);
    --el-mention-border: 1px solid var(--el-border-color-light);
    --el-mention-option-color: var(--el-text-color-regular);
    --el-mention-option-height: 34px;
    --el-mention-option-min-width: 100px;
    --el-mention-option-hover-background: var(--el-fill-color-light);
    --el-mention-option-selected-color: var(--el-color-primary);
    --el-mention-option-disabled-color: var(--el-text-color-placeholder);
    --el-mention-option-loading-color: var(--el-text-color-secondary);
    --el-mention-option-loading-padding: 10px 0;
    --el-mention-max-height: 174px;
    --el-mention-padding: 6px 0;
    --el-mention-header-padding: 10px;
    --el-mention-footer-padding: 10px
}

.el-mention-dropdown__item {
    box-sizing: border-box;
    color: var(--el-mention-option-color);
    cursor: pointer;
    font-size: var(--el-mention-font-size);
    height: var(--el-mention-option-height);
    line-height: var(--el-mention-option-height);
    min-width: var(--el-mention-option-min-width);
    overflow: hidden;
    padding: 0 20px;
    position: relative;
    text-overflow: ellipsis;
    white-space: nowrap
}

.el-mention-dropdown__item.is-hovering {
    background-color: var(--el-mention-option-hover-background)
}

.el-mention-dropdown__item.is-selected {
    color: var(--el-mention-option-selected-color);
    font-weight: bold
}

.el-mention-dropdown__item.is-disabled {
    background-color: unset;
    color: var(--el-mention-option-disabled-color);
    cursor: not-allowed
}

.el-mention-dropdown {
    border-radius: var(--el-border-radius-base);
    box-sizing: border-box;
    z-index: calc(var(--el-index-top) + 1)
}

.el-mention-dropdown__loading {
    color: var(--el-mention-option-loading-color);
    font-size: 12px;
    margin: 0;
    min-width: var(--el-mention-option-min-width);
    padding: 10px 0;
    text-align: center
}

.el-mention-dropdown__wrap {
    max-height: var(--el-mention-max-height)
}

.el-mention-dropdown__list {
    box-sizing: border-box;
    list-style: none;
    margin: 0;
    padding: var(--el-mention-padding)
}

.el-mention-dropdown__header {
    border-bottom: var(--el-mention-border);
    padding: var(--el-mention-header-padding)
}

.el-mention-dropdown__footer {
    border-top: var(--el-mention-border);
    padding: var(--el-mention-footer-padding)
}